<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="tpl :: common_head()"></th:block>
    <title>协议管理</title>
</head>
<body th:object="${obj}" th:with="entrance='/system/productWasteManagement/index'">
<th:block th:replace="tpl :: common_body(~{::.main-right})">
    <div class="main-right">
        <h1 class="main-right-h1" th:if="*{id==0}" th:text="${orgName+'新增协议'}"></h1>
        <h1 class="main-right-h1" th:if="*{id!=0}" th:text="${orgName+'编辑协议'}"></h1>
        <ul class="main-right-tab">
            <li><a th:href="${'../../agreement/'+orgId+'?orgName='+orgName}">列表</a></li>
            <li class="selected" th:if="*{id==0}">新增</li>
            <li class="selected" th:if="*{id!=0}">编辑</li>
        </ul>
        <form class="form" method="POST" onsubmit="return buildImg()">
            <fieldset>
                <legend>信息</legend>
                <dl>
                    <dt>经营单位</dt>
                    <dd>
                        <select th:field="*{name}" id="course">
                            <option th:each="obj : ${@orgVerifyService.getOrgVrifyList()}" th:value="${obj}"
                                    th:text="${obj}"></option>
                        </select>
                    </dd>
                    <dt>协议有效期</dt>
                    <dd>
                        <input type="text" class="layui-input" id="chooseDate" name="expireDate">
                        <input type="hidden" id="date" th:value="*{#dates.format(expireDate,'yyyy-MM-dd')}">
                    </dd>
                    <div id="uploadPics">
                        <div th:id="outUploadPic+${picObjStat.index}" th:if="${picStr!=null}"
                             th:each="picObj:${picStr}">
                            <dt>协议图片</dt>
                            <dd>
                                <img th:id="inUploadPic+${picObjStat.index}" style="width:350px" th:value="${picObj}"
                                     th:src="*{@imageService.getImageBasePath()}+${picObj}"/>
                                <a th:href="'javascript:deletes('+${picObjStat.index}+');'"
                                   style="margin-left:150px">删除</a>
                            </dd>
                        </div>
                    </div>

                    <div id="multiImg">
                        <div id="pic0">
                            <dt>协议图片</dt>
                            <dd>
                                <img id="coverImage0" onclick="showImage('coverImage0','agreement')" style="width:200px"
                                     src="../../../../assets/images/add.png"/>
                            </dd>
                        </div>
                    </div>
                </dl>
                <input type="hidden" th:field="*{pics}" id="pics"/>
                <input type="submit" value="提交"/>
            </fieldset>
        </form>
    </div>
</th:block>
</body>
<script src="../public/assets/libs/layer/laydate/laydate.js" th:src="@{/assets/libs/layer/laydate/laydate.js}"></script>
<script>
    var index = "";

    function close() {
        layer.close(index);
    }

    function showImage(image, type) {
        index = layer.open({
            type: 2,
            area: ['1240px', '500px'],
            title: "图片上传",
            shade: 0.6,
            scrollbar: false,
            fixed: true,
            maxmin: true,
            content: "../../../show/showMultiImagePage/" + type + "/" + image
        });
    }

    laydate.render({
        elem: '#chooseDate',//指定元素
        value: document.getElementById('date').value
    });

    $(document).ready(function () {
        $('#course').select2();
    });

    function buildImg() {
        var picNums = $('#multiImg div').length;
        var coverStr = [];
        var startNumber = 0;
        for (var i = 0; i < uploadNums; i++) {
            if ($('#inUploadPic' + i).attr("value") != undefined) {
                coverStr[startNumber] = $('#inUploadPic' + i).attr("value");
                startNumber++
            }
        }

        for (var i = startNumber, j = 0; i < picNums + startNumber - 1 && j < picNums - 1; i++, j++) {
            if ($('#coverImage' + j).val() != undefined) {
                coverStr[i] = $('#coverImage' + j).val();
            }
        }
        coverStr.join(",")
        $('#pics').val(coverStr);
    }

    function deletes(id) {
        $("#outUploadPic" + id).remove();
    }

    var uploadNums;
    window.onload = function () {
        uploadNums = $('#uploadPics div').length;
    }
</script>
<style>
    .form dt {
        width: 135px;
    }
</style>
</html>